<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>table模块快速使用</title>
  <link rel="stylesheet" href="layui-v2.3.0/css/layui.css" media="all">
</head>
<body>
 
 	<ul id="city_list"></ul>

	<div id="pageing" class=""></div>

  <script src="layui-v2.3.0/layui.js"></script>
  <script src="jquery-3.2.1.min.js"></script>
  <script>
  	layui.use("laypage",function(){
  		var laypage = layui.laypage;

  		var data = [
		    '北京',
		    '上海',
		    '广州',
		    '深圳',
		    '杭州',
		    '长沙',
		    '合肥',
		    '宁夏',
		    '成都',
		    '西安',
		    '南昌',
		    '上饶',
		    '沈阳',
		    '济南',
		    '厦门',
		    '福州',
		    '北京',
		    '上海',
		    '广州',
		    '深圳',
		    '杭州',
		    '长沙',
		    '合肥',
		    '宁夏',
		    '成都',
		    '西安',
		    '南昌',
		    '上饶',
		    '沈阳',
		    '济南',
		    '厦门',
		    '福州',
		    '九江',
		    '宜春',
		    '赣州',
		    '宁波',
		    '绍兴',
		    '无锡',
		    '苏州',
		    '徐州',
		    '东莞',
		    '佛山',
		    '中山',
		    '成都',
		    '武汉',
		    '青岛',
		    '天津',
		    '重庆',
		    '南京',
		    '九江',
		    '香港',
		    '澳门',
		    '台北'
		  ];

  		laypage.render({
  			elem: "pageing",
  			count: data.length,   //数据总数
  			jump:function(obj){
  				//obj包含了当前分页的所有参数
  				console.log(obj.curr);  //得到当前页
  				console.log(obj.limit); //得到每页显示的条数

  				$("#city_list").html(function(){
  					var arr = [],
  					thisData = data.concat().splice(obj.curr*obj.limit - obj.limit,obj.limit);

  					layui.each(thisData,function(index,item){
  						arr.push("<li>"+item+"</li>");
  					})
  					return arr.join("");
  				});
  			}
  		});
  	});
  </script>
</body>
</html>